<template>
  <el-dialog
    v-el-drag-dialog
    title="详情"
    :close-on-click-modal="false"
    :modal="false"
    :visible.sync="visible"
    width="70%">
    <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="80px">
      <table width="100%" border="0" cellspacing="0" cellpadding="0" class="main">
        <tr>
          <th style="height: 60px"><el-form-item label="微信昵称:" label-width="160px" style="text-align: left">
              <span>{{dataForm.ww}}</span></el-form-item></th>
          <th><el-form-item label="用户手机号:" label-width="160px" style="text-align: left">
              <span>{{dataForm.userName}}</span>
            </el-form-item></th>
        </tr>
        <tr>
          <th style="height: 60px"><el-form-item label="提现金额:" label-width="160px" style="text-align: left">
              <span>￥ {{dataForm.money}}</span></el-form-item></th>
          <th><el-form-item label="帐号类型:" label-width="160px" style="text-align: left">
              <span v-if="dataForm.accType == 0">银行卡</span>
              <span v-if="dataForm.accType == 1">微信</span>
              <span v-if="dataForm.accType == 2">手动打款</span>
              <span v-if="dataForm.accType == 3">商户支付宝</span>
            </el-form-item></th>
        </tr>
        <tr>
          <th style="height: 60px"><el-form-item label="提现帐号:" label-width="160px" style="text-align: left">
              <span>{{dataForm.accountNo}}</span>
            </el-form-item></th>
          <th><el-form-item label="提现状态:" label-width="160px" style="text-align: left">
              <span v-if="dataForm.cashStatus == 0">提现失败</span>
              <span v-if="dataForm.cashStatus == 1">提现成功</span>
              <span v-if="dataForm.cashStatus == 2">提现中</span>
              <span v-if="dataForm.cashStatus == 3">待审核</span>
              <span v-if="dataForm.cashStatus == 5">审核不通过</span>
            </el-form-item></th>
        </tr>
        <tr>
          <th style="height: 60px"><el-form-item label="提现时间:" label-width="160px" style="text-align: left">
              <span>{{dataForm.createTime}}</span>
            </el-form-item></th>
          <th><el-form-item label="处理时间:" label-width="160px" style="text-align: left">
              <span>{{dataForm.handleTime}}</span>
            </el-form-item></th>
        </tr>
        <tr>
          <th style="height: 60px"><el-form-item label="审批备注:" label-width="160px" style="text-align: left">
              <span>{{dataForm.cashRemarks}}</span>
            </el-form-item></th>
          <th><el-form-item label="手续费:" label-width="160px" style="text-align: left">
              <span>￥ {{dataForm.withPoundage}}</span>
          </el-form-item></th>
        </tr>
        <tr>
          <th style="height: 60px"><el-form-item label="流水号:" label-width="160px" style="text-align: left">
              <span>{{dataForm.trxNo}}</span>
            </el-form-item></th>
        </tr>
      </table>
      <!--<el-row :gutter="20">
        &lt;!&ndash;<el-col :span="10">
          <el-form-item label="用户名称:" label-width="160px">
            <span>{{dataForm.withUserName}}</span>
          </el-form-item>
        </el-col>&ndash;&gt;
        <el-col :span="10">
          <el-form-item label="微信昵称:" label-width="160px">
            <span>{{dataForm.ww}}</span>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="用户手机号:" label-width="160px">
            <span>{{dataForm.userName}}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="10">
          <el-form-item label="提现金额:" label-width="160px">
            <span>￥ {{dataForm.money}}</span>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="帐号类型:" label-width="160px">
            <span v-if="dataForm.accType == 0">银行卡</span>
            <span v-if="dataForm.accType == 1">微信</span>
            <span v-if="dataForm.accType == 2">手动打款</span>
            <span v-if="dataForm.accType == 3">商户支付宝</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="10">
          <el-form-item label="提现帐号:" label-width="160px">
            <span>{{dataForm.accountNo}}</span>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="提现状态:" label-width="160px">
            <span v-if="dataForm.cashStatus == 0">提现失败</span>
          <span v-if="dataForm.cashStatus == 1">提现成功</span>
          <span v-if="dataForm.cashStatus == 2">提现中</span>
          <span v-if="dataForm.cashStatus == 3">待审核</span>
          <span v-if="dataForm.cashStatus == 5">审核不通过</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="10">
          <el-form-item label="提现时间:" label-width="160px">
            <span>{{dataForm.createTime}}</span>
          </el-form-item>
        </el-col>
        <el-col :span="10">
          <el-form-item label="处理时间:" label-width="160px">
            <span>{{dataForm.handleTime}}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="10">
          <el-form-item label="审批备注:" label-width="160px">
            <span>{{dataForm.cashRemarks}}</span>
          </el-form-item>
        </el-col>
        &lt;!&ndash; <el-col :span="10">
          <el-form-item label="周内提现次数:" label-width="160px">
            <span>{{dataForm.count}}</span>
          </el-form-item>
        </el-col> &ndash;&gt;
        <el-col :span="10">
          <el-form-item label="手续费:" label-width="160px">
            <span>￥ {{dataForm.withPoundage}}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="20">
        <el-col :span="10">
          &lt;!&ndash; <el-form-item label="周内提现总金额:" label-width="160px">
            <template slot-scope="scope">
              <span v-if="dataForm.weekMoney != null">￥ {{dataForm.weekMoney}}</span>
              <span v-if="dataForm.weekMoney == null">￥ 0</span>
            </template>
          </el-form-item> &ndash;&gt;
        </el-col>
        <el-col :span="10">
          <el-form-item label="流水号:" label-width="160px">
            <span>{{dataForm.trxNo}}</span>
          </el-form-item>
        </el-col>
      </el-row>
      &lt;!&ndash; <el-row :gutter="20">
        <el-col :span="10">
          <el-form-item label="手续费:" label-width="160px">
            <span>￥ {{dataForm.withPoundage}}</span>
          </el-form-item>
        </el-col> &ndash;&gt;
        &lt;!&ndash; <el-col :span="10">
          <el-form-item label="周内提现次数:">
            <span>{{dataForm.count}}</span>
          </el-form-item>
        </el-col> &ndash;&gt;
      &lt;!&ndash; </el-row> &ndash;&gt;-->
      <el-table
        v-show="dataForm.list.length > 0? true : false"
        :data="dataForm.list"
        border="1"
        v-loading="dataListLoading"
        @selection-change="selectionChangeHandle"
        style="width: 100%;">
      <el-table-column
        prop="no"
        header-align="center"
        align="center"
        label="提现订单号">
      </el-table-column>
      <el-table-column
        prop="type"
        header-align="center"
        align="center"
        label="订单类型">
        <template slot-scope="scope">
          <span>{{scope.row.type === 1 ? '线上订单' : (scope.row.type === 2 ? '买单' : '')}}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="money"
        header-align="center"
        align="center"
        label="提现金额">
        <template slot-scope="scope">
          ￥ {{scope.row.money}}
        </template>
      </el-table-column>
      <el-table-column
        prop="createTime"
        header-align="center"
        align="center"
        label="提现时间">
      </el-table-column>
      <el-table-column
        fixed="right"
        header-align="center"
        align="center"
        width="150"
        label="操作">
        <template slot-scope="scope">
          <el-button type="text" size="small" @click="orderDetailsHandle(scope.row.no, scope.row.type)">详情</el-button>
        </template>
      </el-table-column>
      </el-table>
      <!-- <el-pagination
      @size-change="sizeChangeHandle"
      @current-change="currentChangeHandle"
      :current-page="pageIndex"
      :page-sizes="[10, 20, 50, 100]"
      :page-size="pageSize"
      :total="totalPage"
      layout="total, sizes, prev, pager, next, jumper">
    </el-pagination> -->
    </el-form>
    <!-- <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
    </span> -->
    <order-details v-if="orderDetailsVisible" ref="orderDetails" @refreshDataList="init"></order-details>
  </el-dialog>
</template>

<script>
  import OrderDetails from './order-details'
  export default {
    data () {
      return {
        visible: false,
        dataForm: {
          withUserName: '',
          userName: '',
          accType: '',
          money: '',
          accountNo: '',
          cashStatus: '',
          createTime: '',
          handleTime: '',
          cashRemarks: '',
          count: '',
          weekMoney: '',
          trxNo: '',
          ww: '',
          withPoundage: '',
          list: [],
          withrecordid: 0
        },
        orderDetailsVisible: false,
        pageIndex: 1,
        pageSize: 10,
        totalPage: 0,
        dataRule: {}
      }
    },
    components: {
      OrderDetails
    },
    methods: {
      init (id) {
        debugger
        this.dataRule.withrecordid = 0
        this.dataRule.withUserName = ''
        this.dataRule.userName = ''
        this.dataRule.accType = ''
        this.dataRule.money = ''
        this.dataRule.accountNo = ''
        this.dataRule.cashStatus = ''
        this.dataRule.createTime = ''
        this.dataRule.handleTime = ''
        this.dataRule.cashRemarks = ''
        this.dataRule.count = ''
        this.dataRule.weekMoney = ''
        this.dataRule.trxNo = ''
        this.dataRule.ww = ''
        this.dataRule.withPoundage = ''
        this.dataRule.list = []
        this.dataForm.withrecordid = id || 0
        this.dataForm.list = []
        this.visible = true
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
          if (id) {
            this.$http({
              url: this.$http.adornUrl(`/user/cashAudit/getDetailsOfPresentation/${id}`),
              method: 'get',
              params: this.$http.adornParams()
            }).then(({data}) => {
              if (data && data.code === 0) {
                this.dataForm.withUserName = data.data.withUserName
                this.dataForm.userName = data.data.userName
                this.dataForm.money = data.data.money
                this.dataForm.accType = data.data.accType
                this.dataForm.accountNo = data.data.accountNo
                this.dataForm.cashStatus = data.data.cashStatus
                this.dataForm.createTime = data.data.createTime
                this.dataForm.handleTime = data.data.handleTime
                this.dataForm.cashRemarks = data.data.cashRemarks
                this.dataForm.ww = data.data.ww
                this.dataForm.count = data.data.count
                this.dataForm.weekMoney = data.data.weekMoney
                this.dataForm.trxNo = data.data.trxNo
                this.dataForm.withPoundage = data.data.withPoundage
              }
            })
          }
        })
        this.$http({
          url: this.$http.adornUrl(`/user/cashAudit/getSonOrderDetailsById/${this.dataForm.withrecordid}`),
          method: 'get',
          params: this.$http.adornParams({
            'page': this.pageIndex,
            'limit': this.pageSize
          })
        }).then(({data}) => {
          if (data && data.code === 0) {
            this.dataForm.list = data.data.list
            this.totalPage = data.data.totalCount
          } else {
            this.dataList = []
            this.totalPage = 0
          }
        })
      },
      orderDetailsHandle (no, type) {
        this.orderDetailsVisible = true
        this.$nextTick(() => {
          this.$refs.orderDetails.init(no, type)
        })
      }
    },
    // 每页数
    sizeChangeHandle (val) {
      this.pageSize = val
      this.pageIndex = 1
      this.getDataList()
    },
    // 当前页
    currentChangeHandle (val) {
      this.pageIndex = val
      this.getDataList()
    }
  }
</script>
